<!--
 * @Author: yl
 * @Date: 2024-04-10 13:31:37
 * @LastEditTime: 2024-04-10 13:31:37
 * @LastEditors: Please set LastEditors
 * @Description:
// 配置溯源码
-->
<template>
  <BaseMainSlot :show-tab="true">
    <template v-slot:btn-box>
      <ActionBar
        :page-no="607"
        :add-active="addActive"
        :del-active="delActive"
        :edit-active="editActive"
        :has-cancel="false"
        :has-save="false"
        @add="add"
        @cancel="cancel('formData')"
        @edit="edit"
        @del="del"
        @save="save"
      />
    </template>
    <template v-slot:tab-select>
      <selectbutton
        :buttonselectlist="sourceTypeData"
        @nowselectbuttonindex="nowselectbuttonindex"
      />
    </template>
    <template v-slot:search-box>
      <SearchBox @search="search">

        <div class="common-search-item">
          <!-- <div class="topview-pici-title">溯源配置编号：</div> -->
          <!-- <el-select
            v-model="productTraceNos"
            placeholder="请选择溯源配置编号"
            filterable
            clearable
            @change="search()"
          >
            <el-option
              v-for="item in productTraceCodeList"
              :key="item.traceCodeConfigNo"
              :label="item.productTraceCode"
              :value="item.traceCodeConfigNo"
            />
          </el-select> -->
        </div>
      </SearchBox>
    </template>
    <template v-slot:table-box>
      <ZnFilterTable
        v-if="tableUpStauts === 1"
        :loadings="loading"
        :list-data="tableData"
        :prop-list="tableDataList"
        scope-no="traceCodeConfigNo"
        @rowClick="handleEdit"
        @handleSelectionChange="handleSelectionChange($event, 'traceCodeConfigNo')"
        @tableUpdate="tableUpdate"
      >
        <template v-slot:operation="{ row }">
          <el-button
            type="warning"
            class="traceCodeIcon"
            size="mini"
            plain
            @click.stop="showcodeview(row)"
          >查看详细配置</el-button>
          <el-button
            v-if="judgePermission(607, 'generate')"
            type="info"
            class="traceCodeIcon"
            size="mini"
            plain
            @click.stop="
              traceCodeConfig(
                row.traceCodeConfigNo,
                row.organizationNo
              )
            "
          >生成溯源码</el-button>
          <!-- <br /> -->
          <el-button
            type="success"
            class="traceCodeIcon"
            size="mini"
            plain
            @click.stop="traceCodeI(row)"
          >查看溯源码</el-button>
          <el-button
            v-if="judgePermission(607, 'export')"
            type="danger"
            class="traceCodeIcon"
            size="mini"
            plain
            @click.stop="traceSelect(row)"
          >导出全部溯源码</el-button>
        </template>
      </znfiltertable>
      <Pagination
        :page-size="pagmes.pageSize"
        :current-page="pagmes.currentPage"
        :total-size="pagmes.totalSize"
        @changePageSize="changePageSize"
        @changeCurrentPage="changeCurrentPage"
      />
    </template>

    <!-- 弹框 -->
    <template v-slot:dialog>
      <el-dialog
        width="30%"
        :title="titleText + '配置个体溯源信息'"
        :visible.sync="dialogFormVisible"
        :before-close="handleClose"
      >
        <div>
          <el-form
            ref="formData"
            :model="formData"
            :rules="rules"
            label-position="left"
            class="w100p"
          >
            <el-form-item label="溯源信息来源:" prop="sourceType" class="w100p">
              <el-select
                v-model="formData.sourceType"
                clearable
                filterable
                placeholder="溯源信息来源"
                :disabled="!canInput"
                @change="queryTraceConfig"
              >
                <el-option
                  v-for="(item, index) in sourceTypeData"
                  :key="index"
                  :label="item.name"
                  :value="item.type"
                />
              </el-select>
            </el-form-item>
            <el-form-item label="个体选择:" prop="traceConfigNo" class="w100p">
              <el-select
                v-model="formData.traceConfigNo"
                clearable
                filterable
                placeholder="个体选择"
                :disabled="!canInput"
              >
                <el-option
                  v-for="(item, index) in traceConfigData"
                  :key="index"
                  :label="item.individuationInfo&&item.individuationInfo.earLabel || item.product&&item.product.productName"
                  :value="item.traceConfigNo"
                />
              </el-select>
            </el-form-item>
            <p>个体溯源可见信息：</p>
            <el-form-item class="w100p checkbox">
              <el-checkbox
                v-model="checkAll"
                :disabled="!canInput"
                :indeterminate="(
                  !formData.productFlag &&
                  !formData.proprietorFlag &&
                  !formData.individuationFlag &&
                  !formData.reportFlag &&
                  !formData.environmentalFlag === true ? false : (!formData.productFlag || !formData.proprietorFlag || !formData.individuationFlag || !formData.reportFlag || !formData.environmentalFlag))"
                @change="(val) => {
                  $set(formData, 'productFlag', val);
                  $set(formData, 'proprietorFlag', val);
                  $set(formData, 'individuationFlag', val);
                  $set(formData, 'reportFlag', val);
                  $set(formData, 'environmentalFlag', val);
                }"
              >全选</el-checkbox>
              <el-checkbox
                v-model="formData.productFlag"
                :disabled="!canInput"
              >产品信息</el-checkbox>
              <el-checkbox
                v-model="formData.proprietorFlag"
                :disabled="!canInput"
              >主体信息</el-checkbox>
              <el-checkbox
                v-model="formData.individuationFlag"
                :disabled="!canInput"
              >个体信息</el-checkbox>
              <el-checkbox
                v-model="formData.reportFlag"
                :disabled="!canInput"
              >检验报告</el-checkbox>
              <el-checkbox
                v-model="formData.environmentalFlag"
                :disabled="!canInput"
              >环境数据</el-checkbox>
            </el-form-item>
          </el-form>
        </div>
        <span v-if="canInput" slot="footer" class="dialog-footer">
          <el-button class="zh-button-one" @click="reset('formData')">取 消</el-button>
          <el-button
            class="zh-button-two"
            type="primary"
            @click="save('formData')"
          >确 定</el-button>
        </span>
      </el-dialog>
      <!-- 生成溯源码 -->
      <div class="codeview">
        <el-dialog width="40%" title="生成溯源码" :visible.sync="isshowcodeview">
          <div class="codeview-box">
            <p>生成溯源码数量：</p>
            <!-- <el-input v-model="total" clearable /> -->
            <el-input-number
              v-model="total"
              controls-position="right"
              :min="1"
              :max="999"
            />
          </div>
          <span slot="footer" class="dialog-footer">
            <el-button class="zh-button-one" @click="isshowcodeview = false">取 消</el-button>
            <el-button
              class="zh-button-two"
              type="primary"
              @click="traceNoT('formData')"
            >生成溯源码</el-button>
          </span>
        </el-dialog>
      </div>
      <el-dialog width="40%" title="预览溯源码" :visible.sync="traceCodeExcelStatus">
        <el-table
          ref="traceCodeIData"
          v-loading="loading"
          highlight-current-row
          :data="traceCodeIData"
          stripe
          border
          height="100%"
          @selection-change="handleIExcelChange"
        >
          <el-table-column type="selection" width="55" />
          <el-table-column type="index" label="序号" width="60" />
          <el-table-column prop="traceCodeConfigNo" label="溯源码" width="250">
            <template slot-scope="scope">
              {{ scope.row.tracingSourceCodeNo }}-{{ scope.row.serialNumber }}
            </template>
          </el-table-column>
          <el-table-column prop="configurationTime" label="生成时间" />
          <el-table-column prop="average" label="预览">
            <template slot-scope="scope">
              <el-button
                type="primary"
                @click.stop="configIcon(scope.row.url)"
              >预览溯源码</el-button>
            </template>
          </el-table-column>
        </el-table>
        <span slot="footer" class="dialog-footer">
          <el-button
            class="zh-button-one"
            @click="traceCodeExcelStatus = false"
          >取 消</el-button>
          <el-button
            v-if="judgePermission(607, 'export')"
            class="zh-button-two"
            type="primary"
            @click="traceSelect({
              organizationNo: organizationNo,
              traceCodeConfigNo: traceCodeConfigNo
            })
            "
          >导出全部</el-button>
          <!-- <el-button type="primary" @click="traceCodeIExcel(organizationNo)">导出</el-button> 暂无接口 -->
          <el-button
            v-if="judgePermission(607, 'print')"
            type="warning"
            @click="btnClickPrint2"
          >打印设计</el-button>
          <el-button type="primary" @click="btnClickPrint">打印</el-button>
        </span>
      </el-dialog>
      <div class="codeview">
        <el-dialog width="40%" title="预览溯源码" :visible.sync="traceCodeStatus">
          <vue-qr
            :text="downloadData.url"
            :margin="10"
            color-dark="#000"
            color-light="#fff"
            :dot-scale="1"
            :logo-scale="0.2"
            :size="200"
            :logo-src="downloadData.icon"
          />
        </el-dialog>
      </div>
    </template>

  </BaseMainSlot>
</template>
<script>
import { mapGetters } from "vuex";
import Pagination from "@/components/Pagination";
import ActionBar from "@/components/ActionBar";
import selectbutton from "@/components/selectbutton/index.vue";
import { getToken } from "@/utils/auth";
import { mymixin } from "@/utils/mixins";
import vueQr from "vue-qr";
import SearchBox from "@/components/SearchBox";
import { getLodop } from "@/plugins/LodopFuncs";

import traceConfigApi from "@/api/trace-source-web/traceConfig";
// 获取生成溯源码
import sourceApi from "@/api/trace-source-web/tracing-source-code/tracing-source-code";
// 获取编码
import codingApi from "@/api/trace-source-web/tracing-source-code/coding-management";
import imageApi from "@/api/trace-source-web/tracing-source-code/tracing-source-image";
export default {
  // eslint-disable-next-line vue/name-property-casing
  name: "configurationTracingSourceCode",
  components: {
    Pagination,
    selectbutton,
    ActionBar,
    SearchBox,
    vueQr
  },
  mixins: [mymixin],
  data() {
    return {
      loading: false,
      // 输入框是否可修改true为可修改
      canInput: false,
      titleInput: false,
      // 添加删除修改状态---主要通过此状态来判断调用方法
      nowChanceStau: "",
      // 操作按钮的逻辑及展示数据
      isshowcodeview: false,
      checkAll: true,
      tableData: [],
      formData: {
        organizationNo: sessionStorage.organizationNo
      },
      tableDataList: [
        {
          type: "input", // input Select Checkbox TimePicker
          porp: "traceCodeConfigNo",
          typeObj: {},
          name: "溯源码配置编号",
          required: true
        },
        {
          type: "input", // input Select Checkbox TimePicker
          porp: "configurationTime",
          typeObj: {},
          name: "配置时间",
          required: true,
          notSearch: true
        },
        {
          porp: 'operation', name: '操作', slotName: 'operation', fixed: true,
          minWidth: "160",
          typeObj: {},
          show: false,
          notSearch: true
        }
      ],
      traceConfigData: [],
      image: null,
      imgurl: "",
      scopeData: [],
      traceCodeIData: [],
      productTraceNos: undefined,
      productTraceConfigNoList: [],
      buttonselectlist: [],
      total: 1,
      traceCodeConfigNo: undefined,
      // 搜索信息
      productTraceCodeList: [],
      traceCodeExcelStatus: false,
      traceCodeStatus: false,
      downloadData: {
        url: "",
        icon: ""
      },
      topitemtypeid: 0,
      isshowview: false,
      nowimageurl: "",
      pagmes: {
        pageSize: 10,
        currentPage: 1,
        totalSize: 0
      },
      rules: {
        traceConfigNo: [
          { required: true, message: "请选择溯源信息", trigger: "change" }
        ]
      },
      artificialProductionStatus: false,
      scopeType: "",
      SRCImage: "",
      traceNoIdList: [],
      varietylist: [],
      varietyName: undefined,
      facilityArr: [],
      productionBaseList: [],
      facilityNo: "",
      type: "",
      batchNo: undefined,
      // 系统路径
      sourceTypeData: [
        { type: "系统生成", name: "系统生成" },
        { type: "人工录入", name: "人工录入" }
      ],
      systemPathStatus: false
    };
  },
  computed: {
    ...mapGetters({
      judgePermission: "permission/judgePermission"
    })
  },
  created() {
    this.traceCode();
  },
  mounted() {
    // 获取传入参数
    let tr = this.$route.params;
    if (tr.traceConfigNo) {
    // this.topitemtypeid
      this.nowChanceStau = 'add';
      this.titleText = '添加'
      this.canInput = true;
      this.dialogFormVisible = true;
      this.queryTraceConfig(tr.sourceType, true);
      this.$set(this.formData, 'sourceType', tr.sourceType)
      this.$set(this.formData, 'traceConfigNo', tr.traceConfigNo)
      this.$set(this.formData, 'productFlag', true)
      this.$set(this.formData, 'proprietorFlag', true)
      this.$set(this.formData, 'individuationFlag', true)
      this.$set(this.formData, 'reportFlag', true)
      this.$set(this.formData, 'environmentalFlag', true)
      delete this.$route.params.traceConfigNo;
    }
    console.log(tr);
  },
  methods: {
    // 按钮当前选择index
    nowselectbuttonindex(i) {
      this.topitemtypeid = i;
      this.search();
      this.traceCode();
    },
    selectable(row) {
      return !row.traceCodeConfigNo; // 通过某个值来进行判断，规定那一行的选择框被禁用
    },
    traceCode() {
      // 查询溯源信息
      // this.queryTraceConfig();
      imageApi.traceCodeImage(getToken("organizationNo")).then((res) => {
        // console.log(res.data)
        let data = res.data;
        this.SRCImage = data[0]?.url || "";
      });
    },
    queryTraceConfig(e, x) {
      traceConfigApi.conditionQuery({ traceType: '个体', sourceType: e || this.topitemtypeid.name }).then(res => {
        if (res.code === 1) {
          this.traceConfigData = res.data || [];
          !x && this.$set(this.formData, 'traceConfigNo', '')
        } else {
          this.$message.warning(res.msg)
        }
      });
    },
    // 所有
    async productTraceCondition(e) {
      const { data: resp } = await sourceApi.productTraceCondition({
        farmingTypeNo: sessionStorage.farmingTypeNo,
        type: e
      });
      this.productTraceCodeList = resp;
    },
    //   获取表格信息
    getTableDataList() {
      let params = {
        page: this.pagmes.currentPage,
        size: this.pagmes.pageSize,
        entity: { ...this.searchObj, sourceType: this.topitemtypeid.name,
          traceType: '个体' }
      };
      sourceApi.productTracePageList(params).then((res) => {
        if (res.code === 1) {
          let data = res.data;
          this.pagmes.totalSize = data.totalElements;

          let content = data.content;
          this.tableData = content;
        } else {
          this.tableData = [];
        }
        this.addblankmet();
      });
    },
    traceCodeConfig(e, s) {
      this.traceCodeConfigNo = e;
      this.organizationNo = s;
      this.isshowcodeview = true;
    },
    // 生产溯源码
    traceNoT() {
      this.isshowcodeview = true;
      if (this.total < 1) {
        this.$message.warning("数量不能少于1");
        return;
      }
      if (this.total > 999) {
        this.$message.warning("数量不能少于1");
        this.total = 999;
        return;
      }
      codingApi.addcode('TRACE').then(codeRes => {
        let params = {
          organizationNo: sessionStorage.organizationNo,
          traceCodeConfigNo: this.traceCodeConfigNo,
          total: this.total,
          tracingSourceCodeNo: codeRes.data
        };
        sourceApi.traceNoList(params).then((res) => {
          // console.log()
          if (res.code === 1) {
            // this.$message.success('添加成功')
            sourceApi
              .editTraceCode({
                traceCodeConfigNo: this.traceCodeConfigNo,
                status: true
              })
              .then((res) => {
                if (res.code === 1) {
                  this.$message.success("添加成功");
                  this.$confirm("是否直接导出溯源码？", "确认信息", {
                    distinguishCancelAndClose: true,
                    confirmButtonText: "导出",
                    cancelButtonText: "取消"
                  })
                    .then(() => {
                      this.isshowcodeview = false;
                      this.traceSelect({
                        organizationNo: this.organizationNo,
                        traceCodeConfigNo: this.traceCodeConfigNo
                      });
                      this.traceCodeConfigNo = "";
                    })
                    .catch((action) => {
                      this.$message({
                        type: "info",
                        message:
                          action === "cancel"
                            ? "放弃保存并离开页面"
                            : "停留在当前页面"
                      });
                      this.traceCodeConfigNo = "";
                    });
                  this.isshowcodeview = false;
                  this.total = 1;
                  this.getTableDataList();
                } else {
                  this.$message.warning("添加失败");
                }
              });
          } else {
            this.$message.warning("添加失败");
          }
        });
      })
      // <el-button @click="traceSelect({ organizationNo: organizationNo, traceCodeConfigNo: traceCodeConfigNo })">取 消</el-button>
    },
    traceCodeI(e) {
      this.traceCodeExcelStatus = true;
      this.traceCodeConfigNo = e.traceCodeConfigNo;
      this.organizationNo = e.organizationNo;
      sourceApi
        .traceByCondition({ traceCodeConfigNo: e.traceCodeConfigNo })
        .then((res) => {
          const data = res.data;
          this.traceCodeIData = data;
        });
    },
    configIcon(e) {
      this.$set(
        this.downloadData,
        "url",
        e
      );
      this.$set(this.downloadData, "icon", this.SRCImage || "");
      this.traceCodeStatus = true;
    },
    // 导出全部溯源码
    traceSelect(e) {
      sourceApi
        .traceExcelAll({
          traceCodeConfigNo: e.traceCodeConfigNo,
          organizationNo: e.organizationNo
        })
        .then((res) => {
          const data = res;
          // let traceNoIdList = batchList.map(item => item.traceNoId)
          // sourceApi.traceExcel(traceNoIdList).then(res => {
          //   let data = res
          //   // this.dialogFormVisible = false
          // const blob = new Blob([data], {
          //   type: "application/vnd.ms-download;charset=utf-8"
          // });
          const blob = new Blob([data], {
            type: "application/vnd.ms-excel;charset=utf-8"
          });
          const link = document.createElement("a");
          // link.download = `溯源码-${this.dateToFormat(new Date())}.doc`;
          link.download = `溯源码-${this.dateToFormat(new Date())}.xls`;
          // console.log(data)
          link.style.display = "none";
          // console.log(blob)
          link.href = URL.createObjectURL(blob);
          document.body.appendChild(link);
          link.click();
          URL.revokeObjectURL(link.href);
          document.body.removeChild(link);
          // });
        });
    },
    traceCodeIExcel(e) {
      if (this.traceNoIdList.length <= 0) {
        return this.$message.warning("请至少选择一个溯源码");
      }
      sourceApi.traceExcel(this.traceNoIdList, e).then((res) => {
        let data = res;
        // const blob = new Blob([data], {
        //   type: "application/vnd.ms-download;charset=utf-8"
        // });
        const blob = new Blob([data], {
          type: "application/vnd.ms-excel;charset=utf-8"
        });
        const link = document.createElement("a");
        // link.download = `溯源码-${this.dateToFormat(new Date())}.doc`;
        link.download = `溯源码-${this.dateToFormat(new Date())}.xls`;
        // console.log(data)
        link.style.display = "none";
        // console.log(blob)
        link.href = URL.createObjectURL(blob);
        document.body.appendChild(link);
        link.click();
        URL.revokeObjectURL(link.href);
        document.body.removeChild(link);
        this.traceCodeExcelStatus = false;
      });
    },
    handleIExcelChange(list) {
      this.traceNoIdList = [];
      this.traceNoIdList = list;
      // if (this.traceNoIdList.length > 0) this.delActive = true;
      // else this.delActive = false;
    },
    // 点击行
    handleEdit(row) {
      // console.log(row);
      this.formData = JSON.parse(JSON.stringify({ ...row, sourceType: this.topitemtypeid.name }));
      // TODO 点击行元素后 edit
      this.addHide = true;
      this.addActive = true;
      this.editActive = true;
      this.saveActive = false;
      this.canInput = false;
      // console.log(this.scopeData)
      if (!row.traceCodeConfigNo) {
        this.editActive = false;
      }
    },
    handleSelectionChange(list, No) {
      this.productTraceConfigNoList = [];
      this.productTraceConfigNoList = list.map((item) => item[No]);
      if (this.productTraceConfigNoList.length > 0) this.delActive = true;
      else this.delActive = false;
    },
    delmessage() {
      sourceApi
        .delTraceCode({
          noList: this.productTraceConfigNoList
        })
        .then((res) => {
          if (res.code === 1) {
            this.$message.success(res.msg);
            this.getTableDataList();
            this.resetActionBar();
          } else {
            this.$message.warning(res.msg || "删除失败");
          }
        });
    },
    // 设置图片
    setimage(e) {
      this.nowimageurl = e;
    },
    // 展示当前编码
    showcodeview(data) {
      this.formData = { ...data, sourceType: this.topitemtypeid.name };
      this.queryTraceConfig(this.topitemtypeid.name, true);

      this.titleText = "查看";
      this.canInput = false;
      this.titleInput = false;
      this.dialogFormVisible = true;
    },
    addPlus() {
      this.$set(this.formData, 'productFlag', true)
      this.$set(this.formData, 'proprietorFlag', true)
      this.$set(this.formData, 'individuationFlag', true)
      this.$set(this.formData, 'reportFlag', true)
      this.$set(this.formData, 'environmentalFlag', true)
    },
    save(formData) {
      this.$refs[formData].validate((valid) => {
        if (valid) {
          if (this.nowChanceStau === "edit") {
            sourceApi.editTraceCode(this.formData).then((res) => {
              if (res.code === 1) {
                this.$message.success(res.msg || "修改成功！");
                this.$refs[formData].clearValidate();
                this.search();
                this.dialogFormVisible = false;
                this.resetActionBar();
              } else {
                this.$message.error(res.msg || "修改失败！");
              }
            });
          } else if (this.nowChanceStau === "add") {
            sourceApi.traceCode({ ...this.formData, traceType: '个体' }).then((res) => {
              if (res.code === 1) {
                this.$message.success(res.msg || "新增成功！");
                this.$refs[formData].clearValidate();
                this.search();
                this.dialogFormVisible = false;
                this.resetActionBar();
              } else {
                // this.queryDatalist();
                this.$message.error(res.msg || "新增失败！");
              }
            });
          }
        } else {
          return false;
        }
      });
    },
    reset(formData) {
      this.formData = {
        organizationNo: sessionStorage.organizationNo
      };
      if (formData) {
        this.$refs[formData].clearValidate();
      }
      this.addActive = true;
      this.dialogFormVisible = false;
    },
    // 打印
    btnClickPrint() {
      if (this.traceNoIdList.length <= 0) {
        return this.$message.warning("请至少选择一个溯源码");
      }

      let LODOP = getLodop();

      LODOP.SET_LICENSES("", "897EEB36654654D6DCF80B006DB8E7C8", "", "");

      sourceApi
        .queryByOrganizationNo(sessionStorage.organizationNo)
        .then((res) => {
          let printScript = res.data?.tracePrintTemplate;
          let count =
            (printScript ? printScript.split("${url}") : []).length - 1;
          let len = this.traceNoIdList.length;
          if (count) {
            // 遍历打印
            for (let i = 1; i <= len; i = i + count) {
              let printScript = res.data?.tracePrintTemplate;
              let list = printScript.split("${url}") || [];
              let str = "";
              for (let j = 0; j < count; j++) {
                if (i + j <= len) {
                  let url = this.traceNoIdList[i + j - 1].url;
                  str += list[j] + url;
                }
              }
              str += list[list.length - 1];
              this.createTemp(str);
              LODOP.PRINT();
            }
          }
        });
    },
    // 打印设计
    btnClickPrint2() {
      let LODOP = getLodop();

      LODOP.SET_LICENSES("", "897EEB36654654D6DCF80B006DB8E7C8", "", "");
      if (LODOP.CVERSION) {
        CLODOP.On_Return = (TaskID, Value) => {
          sourceApi
            .update({
              organizationNo: sessionStorage.organizationNo,
              tracePrintTemplate: Value
            })
            .then((res) => {
              this.$message[res.code == 1 ? "success" : "error"](res.msg);
            });
        };
      }
      sourceApi
        .queryByOrganizationNo(sessionStorage.organizationNo)
        .then((res) => {
          let printScript = res.data.tracePrintTemplate;
          this.createTemp(printScript);
          LODOP.PRINT_DESIGN();
        });
    },
    createTemp(printScript) {
      let LODOP = getLodop();

      LODOP.SET_LICENSES("", "897EEB36654654D6DCF80B006DB8E7C8", "", "");
      eval(printScript);
    },
    handleClose(done) {
      this.resetActionBar();
      this.reset();
      done();
      // this.$confirm("确认关闭？")
      //   .then(_ => {
      //   })
      //   .catch(_ => {});
    }
  }
};
</script>
<style lang="scss" scoped>
::v-deep {
  .el-button--danger.is-plain:focus {
    color: #F56C6C;
  }

  .el-button--success.is-plain:focus {
    color: #67C23A;
  }

  .el-button--info.is-plain:focus {
    color: #909399;
  }

  .el-button--warning.is-plain:focus {
    color: #E6A23C;
  }
}
::v-deep .el-form-item__label {
  color: #000 !important;
}
::v-deep .el-form-item__content {
  .el-input__inner {
    color: #000 !important;
  }
}
::v-deep.el-form-item--medium .el-form-item__content {
  display: flex;
}
::v-deep.el-select {
  width: 100%;
}
// .codeview {
//   ::v-deep.el-dialog {
//     height: 350px;
//   }
// }
::v-deep .el-dialog__footer {
  position: absolute;
  bottom: 20px;
  right: 20px;
}
.zh-topview {
  width: 100%;
  height: 45px;
  padding-left: 20px;
  padding-right: 20px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  ::v-deep.el-select {
    width: 200px !important;
  }
  .topview-pici {
    // width: 500px;
    margin-left: 10px;
    // background-color: aqua;
    line-height: 30px;
    display: flex;
    .topview-pici-title {
      min-width: 80px;
      height: 36px;
      line-height: 36px;
      text-align: end;
      padding-right: 10px;
    }
    .el-select {
      width: 300px;
    }
  }
  .topview {
    .el-select {
      width: 120px !important;
    }
  }
}
// 头部添加
.action-bar {
  width: 100%;
  height: 50px;
  // background-color: #00485a;/
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  margin-bottom: 10px;
  .btn-list {
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    .btn-item {
      margin-right: 15px;
    }
  }
}
::v-deep .el-dialog__wrapper {
  .el-dialog {
    // width: 50% !important;

    // width: 55% !important;
    min-width: 55%;
    .el-dialog__body {
      .el-form {
        .checkbox {
          // background: #00000000;
          display: block;
          .el-form-item__content {
            width: 95%;
            margin-left: 5%;
            position: relative;
            .checkboxck {
              position: absolute;
              top: 20px;
              left: 22px;
              // .el-button {
              // }
              .el-button--medium {
                padding: 0;
              }
            }
            .el-checkbox__input.is-indeterminate {
              .el-checkbox__inner {
                background-color: rgba(0, 110, 145, 1);
                border-color: rgba(0, 110, 145, 1);
              }
              .el-checkbox__label {
                color: rgba(0, 110, 145, 1);
              }
            }
            .el-checkbox.is-checked {
              .el-checkbox__inner {
                background-color: rgba(0, 110, 145, 1);
                border-color: rgba(0, 110, 145, 1);
              }
              .el-checkbox__label {
                color: rgba(0, 110, 145, 1);
              }
            }
            .checkbox-group {
              padding-left: 66px;
              min-height: 120px;
              overflow-y: auto;
              .el-checkbox {
                padding: 2px 10px;
                border: 1px solid rgba(220, 223, 230, 1);
                border-radius: 5px;
                margin-bottom: 10px;
              }
              .el-checkbox.is-checked {
                border: 1px solid rgba(0, 110, 145, 1);
                .el-checkbox__label {
                  color: rgba(0, 110, 145, 1);
                }
              }
            }
          }
        }
      }
    }
  }
}
// 溯源码
.codeview {
  ::v-deep .el-dialog {
    width: 25% !important;
    min-width: 25% !important;
    // height: 40vh !important;
    .codeview-box {
      width: 100%;
      height: 15vh;
      display: flex;
      align-items: center;
      p {
        width: 30%;
        white-space: nowrap;
      }
      .el-input {
        width: 90%;
        font-size: 18px;
      }
      .el-input-number--medium {
        width: 100%;
      }
    }
  }
}
::v-deep .el-upload--picture-card {
  width: 40px;
  height: 40px;
  background-color: rgba(255, 255, 255, 0.1);
  border: 1px solid #6ecae3;
}
::v-deep .el-upload--picture-card {
  position: relative;
}
::v-deep .el-upload--picture-card .el-icon-plus {
  font-size: 34px;
  color: #6ecae3;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
::v-deep .el-dialog__body {
  text-align: center;
}
.el-upload__tip {
  font-size: 12px;
  color: #606266;
  margin-top: 7px;
  position: absolute;
  width: 150px;
}
// 禁用样式
::v-deep .el-checkbox-button.is-disabled.is-checked {
  .el-checkbox-button__inner {
    color: #fff !important;
    background-color: #409eff80 !important;
    border-color: #409eff80 !important;
    -webkit-box-shadow: -1px 0 0 0 #409eff80 !important;
    box-shadow: -1px 0 0 0 #409eff80 !important;
  }
}
// 操作按钮 宽度统一
.traceCodeIcon {
  // width: 80px;
  padding: 10px 15px;
  margin-bottom: 5px;
  background: transparent;
    border-color: transparent;
    text-decoration: underline;
    text-underline-offset: 3px;
    &:hover,&:focus {

      background: transparent;
      border-color: transparent;
    }
}
::v-deep .el-dialog {
  .el-dialog__body {
    .el-table {
      // 解决行无法铺满整个表格
      .el-table__body {
        height: auto;
        // position: absolute;
        tr.current-row > td {
          background-color: #84c6d9;
        }
      }
      max-height: 40vh !important;
      overflow-y: auto;
      background-color: rgba(255, 255, 255, 1);
      .cell {
        color: #343434;
      }
      th {
        background-color: #c6dae1;
      }
      .el-input__inner {
        // border-right: none;
        padding: 0 5px;
      }
      .el-date-editor {
        .el-input__inner {
          // border-right: none;
          padding: 0 20px;
        }
        .el-input__prefix {
          left: 0;
        }
        .el-input__suffix {
          right: 0;
        }
      }
      .el-table__row {
        background-color: #ffffff;
      }
      .el-table__row--striped {
        background-color: #c6dae1;
      }
      th.is-leaf {
        border-color: rgba(77, 77, 77, 1);
        border: none;
      }
      td {
        border-color: rgba(77, 77, 77, 1);
        border: none;
      }
      tr:hover {
        background-color: #84c6d9 !important;
      }
      .el-table__empty-text {
        color: #343434;
      }
      .current-row {
        // background-color: rgb(177, 177, 177);
        background-color: #dbdbdb !important;
      }
      // color: #343434;
    }
    .el-table--border {
      border-color: rgba(77, 77, 77, 1);
      border: none;
      border-top-left-radius: 8px;
      border-top-right-radius: 8px;
    }
  }
}
::v-deep .zhcontent {
  .el-table {
    width: 87vw;
    height: 90% !important;
    .el-table__body-wrapper {
      height: 100% !important;
    }
  }
}
</style>
